<template>
  <div class="execution">
    <basic-container>
      <avue-crud
        v-model="form"
        v-bind="bindVal"
        v-on="onEvent"
        :page.sync="page"
        :table-loading="tableLoading"
        :option="tableOption"
        @on-load="getList"
        @search-change="searchChange"
        @search-reset="searchReset"
        @refresh-change="refreshChange"
        :permission="permissionList"
        :before-open="handleBeforeOpen"
      >
        <template slot="menuLeft">
          <el-button
            type="primary"
            size="small"
            v-permission="permissionList.noticeBtn"
            @click="notice"
            >通知</el-button
          >
          <el-button type="primary" size="small" @click="handleExport"
            >导出
          </el-button>
        </template>
        <template slot-scope="{row, index}" slot="menu">
          <el-button
            icon="el-icon-edit"
            v-if="row.noticeStatus == '0'"
            v-permission="permissionList.editBtn"
            type="text"
            size="small"
            plain
            @click="rowEdit(row, index)"
            >编 辑</el-button
          >
          <el-button
            icon="el-icon-delete"
            v-if="row.noticeStatus == '0'"
            v-permission="permissionList.delBtn"
            type="text"
            size="small"
            plain
            @click="rowDel(row, index)"
            >删 除</el-button
          >
        </template>
      </avue-crud>
    </basic-container>
  </div>
</template>

<script>
import baseCrud from "@/mixins/base-crud";
import { dateFormat } from "@/util/date";
import {
  fetchList,
  exportExcel,
  noticeBatch,
} from "@/api/subwayepm/swexcheckfault";
import {
  tableOption,
  startDate,
  endDate,
} from "@/const/crud/subwayepm/swexcheckfault";
import { handleExcelResponse } from "@/util/util";

export default {
  name: "swexcheckfault",
  mixins: [baseCrud("subwayepm/swexcheckfault")],
  data() {
    return {
      searchForm: {
        checkDate: [startDate, endDate],
      },
      tableLoading: false,
      tableOption: tableOption,
      page: {
        total: 0, // 总页数
        currentPage: 1, // 当前页数
        pageSize: 20, // 每页显示多少条
      },
    };
  },
  computed: {
    permissionList() {
      return {
        addBtn: this.vaildData(
          this.permissions.epm_sw_ex_check_fault_add,
          false
        ),
        delBtn: this.vaildData(
          this.permissions.epm_sw_ex_check_fault_del,
          false
        ),
        editBtn: this.vaildData(
          this.permissions.epm_sw_ex_check_fault_edit,
          false
        ),
        noticeBtn: this.vaildData(
          this.permissions.epm_sw_ex_check_fault_noticeBatch,
          false
        )
      };
    },
  },
  watch: {
    "form.dataType": {
      handler(newValue, oldValue) {
        if (newValue == "0") {
          this.tableOption.column[18].addDisplay = true;
          this.tableOption.column[18].editDisplay = true;
          this.tableOption.column[18].viewDisplay = true;
        } else {
          this.tableOption.column[18].addDisplay = false;
          this.tableOption.column[18].editDisplay = false;
          this.tableOption.column[18].viewDisplay = false;
        }
      },
    },
  },
  methods: {
    notice() {
      if (
        this.$refs.crud.tableSelect.length < 1 ||
        this.$refs.crud.tableSelect.length > 10
      ) {
        this.$message.error("选中表数量不合法，数量最少1个或最多为10个");
        return false;
      }
      let ids = [];
      for (const table of this.$refs.crud.tableSelect) {
        if (table.noticeStatus != "0") {
          this.$message.error("已通知,请勿重复通知");
          return false;
        }
        ids.push(table);
      }
      noticeBatch(ids)
        .then((data) => {
          //if (data.code == 0) {
            this.$message.success("通知成功");
          //}
          this.getList(this.page);
        })
        .catch(() => {
          //loading();
        });
    },
    getList(page, params) {
      this.tableLoading = true;
      const [startDate, endDate] = this.searchForm.checkDate || [];
      fetchList(
        Object.assign(
          {
            current: page.currentPage,
            size: page.pageSize,
          },
          { startDate, endDate },
          this.searchForm
        )
      )
        .then((response) => {
          this.tableData = response.data.data.records;
          this.page.total = response.data.data.total;
          this.tableLoading = false;
        })
        .catch(() => {
          this.tableLoading = false;
        });
    },
    async searchChange(form, done) {
      this.searchForm = { ...form, ...this.extraParam };
      try {
        await this.getList(this.page, this.searchForm);
      } finally {
        done();
      }
    },
    refreshChange() {
      this.getList(this.page);
    },
    searchReset() {
      this.page.currentPage = 1;
      this.getList(this.page);
    },
    handleBeforeOpen(done, type) {
      if (type == "add") {
        setTimeout(() => {
          this.form.checkTime = dateFormat(new Date());
        });
      }
      done();
    },
    handleExport() {
      let ids = [];
      for (const table of this.$refs.crud.tableSelect) {
        ids.push(table.id);
      }
      var query = Object.assign({}, this.params, this.searchForm);
      let loading = this.$loading({
        lock: true,
        text: "Loading",
        spinner: "el-icon-loading",
        background: "rgba(0, 0, 0, 0.7)",
      });
      query.ids = ids;
      exportExcel(query)
        .then((response) => {
          handleExcelResponse(response, this.exportName);
          loading.close();
        })
        .catch(() => {
          loading.close();
        });
    },
  },
};
</script>
